<template>
  <view class="login-page">
    <!-- <view class="go-back-icon" @click="gotoBackPage">
            <up-icon name="arrow-left" size="24"></up-icon>
        </view> -->
    <image class="login-image" src="../../static/login-背景.jpg" alt="login-背景"></image>
    <view class="login-content">
      <up-form labelPosition="left" :model="formData" :rules="formRules" ref="loginForm">
        <up-form-item label="用户名" prop="account" labelWidth="80" borderBottom>
          <up-input v-model="formData.account" style="width: 100%;" border="none"></up-input>
        </up-form-item>
        <up-form-item label="密码" prop="password" labelWidth="80" borderBottom>
          <up-input v-model="formData.password" border="none" type="password"></up-input>
        </up-form-item>
      </up-form>
      <view class="submit-btn">
        <up-button type="primary" text="登录" @click="loginSubmit"></up-button>
        <view class="no-login-text" @click="goToNoLogin">暂不登录</view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import { authLogin } from '@/genapi/_auth.ts'
import { doBindSupWxOpenPlat } from '@/genapi/_supplier.ts'
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
import { useSupplierStore } from '@/store/index'

const supplierStore = useSupplierStore()
onLoad(() => {
  uni.showShareMenu({
    withShareTicket: true,
    menus: ['shareAppMessage', 'shareTimeline']
  })
})
onShareAppMessage(() => {
  return {
    title: '好达威供应商系统',
    path: '/pages/login/index',
  }
})
onShareTimeline(() => {
  return {
    title: '好达威供应商系统',
    path: '/pages/login/index',
  }
})

const formData = reactive({
  account: '',
  password: ''
})
const formRules = reactive({
  account: {
    type: 'string',
    required: true,
    message: '请输入供应商账号',
    trigger: ['blur', 'change'],
  },
  password: {
    type: 'string',
    required: true,
    message: '请输入密码',
    trigger: ['blur', 'change'],
  }
})
const loginForm = ref(null)

// function gotoBackPage() {
//     uni.navigateBack()
// }

function loginSubmit() {
  loginForm.value.validate().then(async (valid) => {
    if (valid) {
      const params = {
        account: formData.account,
        password: formData.password
      }
      const { data } = await authLogin(params)
      uni.setStorageSync('token', data.data.token)
      uni.setStorageSync('account', formData.account)
      uni.setStorageSync('password', formData.password)
      uni.setStorageSync('isNoLogin', '')
      await supplierStore.getSupplierInfo()
      uni.login({
        provider: 'weixin',
        success(res) {
          console.log("code" + res.code);
          if (res.code) {
            const params = {
              code: res.code,
            }
            doBindSupWxOpenPlat(params)
            uni.switchTab({
              url: '/pages/homePage/index'
            })
          } else {
            console.log('登录失败！' + res.errMsg)
          }
        }
      })
    }
  })
}

function goToNoLogin() {
  uni.setStorageSync('isNoLogin', '1')
  uni.switchTab({
    url: '/pages/index/index'
  })
}
onMounted(() => {
  formData.account = uni.getStorageSync('account')
  formData.password = uni.getStorageSync('password')
})
</script>

<style scoped>
.go-back-icon {
  position: fixed;
  left: 32rpx;
  top: 116rpx;
}

.login-image {
  width: 100%;
  height: 688rpx;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

.login-content {
  position: fixed;
  top: 688rpx;
  left: 0;
  width: 100%;
  height: 936rpx;
  padding-left: 62rpx;
  padding-right: 62rpx;
  padding-top: 28rpx;
  box-sizing: border-box;
}

.submit-btn {
  margin-top: 298rpx;
}

.no-login-text {
  margin-top: 40rpx;
  color: #000;
  text-align: center;
  display: none;
}
</style>
